<template>
  <div>
    <SearchContainer @search="getData" @reset="() => reset()">
      <a-form ref="formRef" class="form-style-flex" :model="formState" :label-col="{ style: { width: '80px' } }">
        <a-form-item name="zjm" label="" class="mr-4">
          <a-input v-model:value="formState.zjm" class="w-64" allow-clear placeholder="药品编号/药品名称/批号" />
        </a-form-item>
        <a-form-item name="rkdh" label="" class="">
          <a-input v-model:value="formState.rkdh" class="w-64" allow-clear placeholder="入库单号" />
        </a-form-item>
        <a-form-item name="lb" label="" class="w-64 ml-8">
          <a-radio-group v-model:value="formState.status" @change="getData">
            <a-radio value="">全部</a-radio>
            <a-radio value="0">正常</a-radio>
            <a-radio value="1">封存</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-form>
    </SearchContainer>
    <a-card class="mt-2">
      <div class="flex">
        <a-button class="mb-2" type="primary" @click="allDisabled"> 一键封存 </a-button>
      </div>
      <BaseTable
        :data-source="tableData"
        fill
        :loading="loading"
        row-key="xh"
        :scroll="{ x: 2050 }"
        column-code="000469"
        :pagination="pagination"
        :row-selection="{
          selectedRowKeys: selectedRowKeys,
          onChange: onSelectChange,
          getCheckboxProps: (record) => ({
            disabled: record.status == '1' ? true : false
          })
        }"
      >
        <template #bodyCell="{ column, record }">
          <template v-if="column.dataIndex === 'mc'">
            <MedicineInfo :value="{ mc: record?.mc, gg: record?.gg, cj: record?.cj }" />
          </template>
          <template v-if="column.dataIndex === 'rkdh'">
            <PopoverTable :config="detailConfig" :params="{ rkdh: record.rkdh }" :width="1300">
              <template #bodyCell="{ column: popColumn, record: popRecord }">
                <template v-if="popColumn.dataIndex === 'ypmc'">
                  <MedicineInfo :value="{ mc: popRecord.ypmc, gg: popRecord.gg, cj: popRecord.cj }" />
                </template>
              </template>
              {{ record.rkdh }}
            </PopoverTable>
          </template>
          <template v-if="column.dataIndex === 'action'">
            <a-space>
              <a-button v-if="record.status === 1" type="link" size="small" @click="changeStatus([record.lsh], '0')">解封</a-button>
              <BaseButton v-else confirm-text="是否确认封存?" type="link" danger size="small" @click="changeStatus([record.lsh], '1')"> 封存 </BaseButton>
            </a-space>
          </template>
        </template>
      </BaseTable>
    </a-card>
  </div>
</template>

<script setup>
import { message } from 'ant-design-vue'
import SearchContainer from '@/components/SearchContainer'
import { post } from '@/utils/request'
import BaseTable from '@/components/BaseTable'

const formRef = ref(null)
const selectedRowKeys = ref([])

const formState = ref({
  status: ''
})
const reset = () => {
  formState.value.status = ''
  formRef.value.resetFields()
}
const detailConfig = ref({
  url: '/drugStorage/psiform/getWarehousingDetailList',
  columnCode: '000471',
  rowKey: 'lsh',
  formatResult: (data) => {
    return data.map((item, index) => ({
      ...item,
      xh: index + 1
    }))
  }
})
const { loading, tableData, pagination, getData } = useTable({
  url: '/drugStorage/psiform/getDrugStorageSealList',
  immediate: false,
  params: formState.value,
  onSuccess: () => {
    selectedRowKeys.value = []
  }
})

const allDisabled = () => {
  if (selectedRowKeys.value.length <= 0) return message.error('至少选择一项')
  const lsh = []
  tableData.value.forEach((item) => {
    if (selectedRowKeys.value.includes(item.xh)) {
      lsh.push(item.lsh)
    }
  })
  changeStatus(lsh, '1')
}
//封存/解封
const changeStatus = async (lsh, status) => {
  const { msg, code } = await post('/drugStorage/psiform/doUpdateStatus', { lsh, status })
  if (code !== 0) {
    message.error(msg)
    return
  }
  message.success(msg)
  getData()
}
const onSelectChange = (select) => {
  selectedRowKeys.value = select
}
</script>
